<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div th:fragment="copy" class="content-wrapper">
    <!-- Main content -->
    <section class="content container-fluid" style="padding:0px">
        <ul class="nav nav-tabs" id="MasterTabs" role="tablist">
            <li class="nav-tabs-header active" role="presentation">
                <a aria-controls="home" data-toggle="tab" href="#home" role="tab">
                    <i class="fa fa-home"></i> Home
                </a>
            </li>
        </ul>
        <!-- Tab panes -->
        <div class="tab-content fixheight">
            <div class="tab-pane active" id="home" role="tabpanel">
                <div class="box box-solid">
                    <div class="box-body">
                        <div class="row">
                            <div class="col-sm-2">
                                <div class="box box-solid no-shadow">
                                    <div class="box-body">
                                        <img class="img-responsive" src="static/images/qrcode.jpg" alt="qrcode" />
                                    </div>
                                </div>
                            </div>

                            <div class="col-sm-7">
                                <div class="box box-solid no-shadow">
                                    <div class="box-header with-border">
                                        <i class="fa fa-text-width"></i>
                                        <h3 class="box-title">软件介绍</h3>
                                    </div>
                                    <div class="box-body">
                                        <p class="text-muted">
                                            基于Bootstrap3.3.6最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术，她提供了诸多的强大的可以重新组合的UI组件，
                                            并集成了最新的jQuery版本(v2.1.4)，当然，也集成了很多功能强大，用途广泛的jQuery插件，她可以用于所有的Web应用程序，如
                                            <b>网站管理后台</b>，<b>网站会员中心</b>，<b>CMS</b>，<b>CRM</b>，<b>OA</b>等等，当然，您也可以对她进行深度定制，以做出更强系统。
                                        </p>
                                        <p class="text-muted">基于AdminLTE框架，增加丰富的bootstrap和Jquery插件，能够满足大多数系统的开发需求。后续将完善权限系统和在线聊天功能等。</p>
                                        <hr />
                                        <p class="text-muted">也请扫码关注我左侧的公众账号,经常会有精品代码免费推送</p>
                                        <hr />
                                        <p>定价：<span class="label label-warning">¥268 （不开发票 包括：权限系统[已实现权限和在线聊天功能]+此框架的全部代码）</span> </p>
                                        <p>
                                            <a class="btn btn-primary" href="http://wpa.qq.com/msgrd?v=3&amp;uin=419761450&amp;site=qq&amp;menu=yes"><i class="fa fa-qq"></i> 联系我</a>
                                            <a class="btn btn-default"><i class="fa fa-book"></i> 查看文档</a>
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-3">
                                <div class="box box-solid no-shadow">
                                    <div class="box-header with-border">
                                        <i class="fa fa-phone"></i>
                                        <h3 class="box-title">联系方式</h3>
                                    </div>
                                    <div class="box-body">
                                        <p>
                                            <i class="fa fa-qq"></i> QQ ： <a href="http://wpa.qq.com/msgrd?v=3&amp;uin=419761450&amp;site=qq&amp;menu=yes">419761450</a>
                                        </p>
                                        <p>
                                            <i class="fa fa-weixin"></i> 微信 ： <a>sunyadongsyd</a>
                                        </p>
                                        <p>
                                            <i class="fa fa-envelope"></i> 邮箱 ： <a>419761450@qq.com</a>
                                        </p>
                                        <p>
                                            <i class="fa fa-credit-card"></i> 支付宝 ： <a>sunyadongsyd@163.com</a>
                                        </p>
                                        <p>
                                            <i class="fa fa-tencent-weibo"></i> 博客 : <a hrel="https://my.oschina.net/u/1867195/blog">https://my.oschina.net/u/1867195/blog</a>
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-sm-8">
                        <div class="nav-tabs-custom">
                            <ul class="nav nav-tabs">
                                <li class="active">
                                    <a href="#activity" data-toggle="tab">项目截图</a>
                                </li>
                                <li><a href="#timeline" data-toggle="tab">更新记录</a></li>
                            </ul>
                            <div class="tab-content">
                                <div class="active tab-pane" id="activity">
                                    <div class="row margin-bottom" id="projectImgs">
                                        <div class="col-sm-6">
                                            <img src="static/images/project/1.png" class="img-responsive" alt="" />
                                        </div>
                                        <div class="col-sm-6">
                                            <div class="row">
                                                <div class="col-sm-4"><img src="static/images/project/2.png" class="img-responsive" alt="" /> <br /><img src="static/images/project/3.png" class="img-responsive" alt="" /><br /><img src="static/images/project/4.png" class="img-responsive" alt="" /></div>
                                                <div class="col-sm-4"><img src="static/images/project/5.png" class="img-responsive" alt="" /><br /><img src="static/images/project/6.png" class="img-responsive" alt="" /><br /><img src="static/images/project/7.png" class="img-responsive" alt="" /></div>
                                                <div class="col-sm-4"><img src="static/images/project/1.png" class="img-responsive" alt="" /><br /><img src="static/images/project/1.png" class="img-responsive" alt="" /><br /><img src="static/images/project/1.png" class="img-responsive" alt="" /></div>
                                            </div>
                                        </div>
                                    </div>
                                    <ul class="list-inline">
                                        <li><a href="#" class="link-black text-sm"><i class="fa fa-share margin-r-5"></i> 分享</a></li>
                                        <li>
                                            <a href="#" class="link-black text-sm"><i class="fa fa-thumbs-o-up margin-r-5"></i> 点赞</a>
                                        </li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="timeline">
                                    <ul class="timeline">
                                        <li class="time-label">
                                                    <span class="bg-red">
                                                        10 Feb. 2014
                                                    </span>
                                        </li>
                                        <li>
                                            <i class="fa fa-comments bg-yellow"></i>

                                            <div class="timeline-item bg-grey">
                                                <span class="time"><i class="fa fa-clock-o"></i> 27 mins ago</span>

                                                <h3 class="timeline-header"><a href="#">Jay White</a> commented on your post</h3>

                                                <div class="timeline-body">
                                                    Take me to your leader!
                                                    Switzerland is small and neutral!
                                                    We are more like Germany, ambitious and misunderstood!
                                                </div>
                                                <div class="timeline-footer">
                                                    <a class="btn btn-warning btn-flat btn-xs">View comment</a>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <i class="fa fa-clock-o bg-gray"></i>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-2">
                        <div class="box box-danger">
                            <div class="box-header with-border">
                                <h3 class="box-title"><i class="fa fa-wechat"></i>微信支付</h3>
                            </div>
                            <div class="box-body">
                                <img src="static/images/wxs.JPG" class="img-responsive" alt="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-2">
                        <div class="box box-danger">
                            <div class="box-header with-border">
                                <h3 class="box-title"><i class="fa fa-credit-card"></i>支付宝支付</h3>
                            </div>
                            <div class="box-body">
                                <img src="static/images/zfbs.JPG" class="img-responsive" alt="" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- /.content -->
</div>
</body>
</html>